<link rel="stylesheet" href="ccay/example/demo.css"  type="text/css" />
<script type="text/javascript" src="ccay/example/demo.js" charset="utf-8"></script>
<script type="text/javascript" src="ccay/example/baseFunction/dataFormat.js" charset="utf-8"></script>

<div id="dataFormatDemo">
    <div title='API' tabid='tab1'>
        <h3 style="padding-bottom:10px">系统中数据之间可相互转换，以下是各类型数据之间的转换的方法：</h3>
	    <form class="ccay-form" >
		<div id='tmpl' class="ccay-form-custom ccay-form-custommore">
			<ul class="ccay-tmpl">			
			<li class="ccay-form-row">
				 <div class="ccay-form-custom ccay-form-custommore">
				  <ul>
				 	 <li class="ccay-form-row">
					 	<span class='ccay-form-input'>
							<h1>1,数字格式化(Number)</h1>
						</span>
					 </li>
					  <li class="ccay-form-row">
					 	<samp>toDate</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDate(1342862225000)&nbsp;&nbsp;&nbsp;&nbsp;
							结果--->&nbsp;&nbsp;2012-07-21T17:17:05.000+0800
						</span>
					 </li>
		
		 			<li class="ccay-form-row">
					 	<samp>toDateTimeStr</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateTimeStr(1342862225000)&nbsp;&nbsp;&nbsp;&nbsp;
							 结果--->&nbsp;&nbsp;"2012-07-21 17:17:05"
						</span>
					 </li>
		
		 			<li class="ccay-form-row">
					 	<samp>toInt</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toInt(123456.789)&nbsp;&nbsp;&nbsp;&nbsp;
							 结果--->&nbsp;&nbsp;123456
						</span>
					 </li>
		
					  <li class="ccay-form-row">
					 	<samp>toDecimal</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDecimal(123456.789)&nbsp;&nbsp;&nbsp;&nbsp;
							结果--->&nbsp;&nbsp;"123456.79"
						</span>
					 </li>
		
					<li class="ccay-form-row">
					 	<samp>toCurrency</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toCurrency(123456.789)&nbsp;&nbsp;&nbsp;&nbsp;
							 结果--->&nbsp;&nbsp;"123,456.79"
						</span>
					 </li>
		
					<li class="ccay-form-row">
					 	<samp>toFileSize</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toFileSize(457892333)&nbsp;&nbsp;&nbsp;&nbsp;
							结果--->&nbsp;&nbsp; "436.68M"
						</span>
					 </li>
		
				 </ul>
				 </div>
				 </span>
			 </li> 
			<li class="ccay-form-row">
				 <div class="ccay-form-custom ccay-form-custommore">
				  <ul>
				  	<li class="ccay-form-row">
					 	<span class='ccay-form-input'>
							<h1>2，字符串格式化(String)</h1>
						</span>
					 </li>
					  <li class="ccay-form-row">
					 	<samp>toDateStr</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateStr("2012-2-12"); &nbsp;&nbsp;&nbsp;&nbsp;
							结果--->&nbsp;&nbsp;"2012-02-12"
						</span>
					 </li>
					 <li class="ccay-form-row">
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateStr("2012-02-12","yyyy-MM-dd"); &nbsp;&nbsp;&nbsp;&nbsp;
							结果--->&nbsp;&nbsp;"2012-02-12"
						</span>
					 </li>
		 			<li class="ccay-form-row">
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateStr('12/12/2012','MM/dd/yyyy','yyyy-MM-dd')&nbsp;&nbsp;&nbsp;&nbsp;
							结果--->&nbsp;&nbsp;"2012-12-12"
						</span>
					 </li>
					<li class="ccay-form-row">
					 	<samp>toNumber</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toNumber('222,333,111.12')&nbsp;&nbsp;&nbsp;&nbsp;
							结果--->&nbsp;&nbsp;222333111.12
						</span>
					 </li>
					<li class="ccay-form-row">
					 	<samp>toEllipsis</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toEllipsis("lwx228530",7)&nbsp;&nbsp;&nbsp;&nbsp;
							 结果--->&nbsp;&nbsp;<pre>"&lt;label class='ccay-Text-Ellipsis' title="lwx228530"&gt;lwx2285...&lt;/label&gt;"</pre>
						</span>
					 </li>
				 </ul>
				 </div>
				 </span>
			 </li> 
			<li class="ccay-form-row">
				 <div class="ccay-form-custom ccay-form-custommore">
				  <ul>
				  	<li class="ccay-form-row">
					 	<span class='ccay-form-input'>
							<h1>3,布尔值格式化(Boolean)</h1>
						</span>
					 </li>
					  <li class="ccay-form-row">
					 	<samp>toBoolView</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toBoolView(1);&nbsp;&nbsp;&nbsp;&nbsp;
							 结果--->&nbsp;&nbsp;"是"
						</span>
					 </li>
					 <li class="ccay-form-row">
					 	<span class='ccay-form-input'>
							Ccay.Format.toBoolView(0);&nbsp;&nbsp;&nbsp;&nbsp;
							  结果--->&nbsp;&nbsp;"否"
						</span>
					 </li>
		 			<li class="ccay-form-row">
					 	<span class='ccay-form-input'>
							Ccay.Format.toBoolView(true,1)&nbsp;&nbsp;&nbsp;&nbsp;
							 结果--->&nbsp;&nbsp;"&lt;a class='ccay-icon yes nocursor' title='是' &gt;&lt;/a&gt;"，
							 页面效果是-->&nbsp;&nbsp;"<a class='ccay-icon yes nocursor' title='是' ></a>"
						</span>
					 </li>
				 </ul>
				 </div>
			 </li> 
			<li class="ccay-form-row">
				 

				 <div class="ccay-form-custom ccay-form-custommore">
				  <ul>
				  	<li class="ccay-form-row">
					 	<span class='ccay-form-input'>
							<h1>4,日期格式化(Date)</h1>
						</span>
					 </li>
					  <li class="ccay-form-row">
					 	<samp>toDateStr</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateStr(new Date());&nbsp;&nbsp;&nbsp;&nbsp;
							结果--->&nbsp;&nbsp;"2014-09-02"
						</span>
					 </li>
		 			<li class="ccay-form-row">
					 	<samp>toDateTimeStr</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateTimeStr(Ccay.Format.toDate("2014-09-02 17:38"));&nbsp;&nbsp;&nbsp;&nbsp;
							结果--->&nbsp;&nbsp;"2014-09-02 17:38:00"
						</span>
					 </li>
					<li class="ccay-form-row">
					 	<samp>toDateNum</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateNum(Ccay.Format.toDate("2014-09-02 17:38"));&nbsp;&nbsp;&nbsp;&nbsp;
							结果--->&nbsp;&nbsp;1409650680000
						</span>
					 </li>
					<li class="ccay-form-row">
					 	<samp>toDateBefore</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateBefore(new Date(2012,6,3,15,0,0));&nbsp;&nbsp;&nbsp;&nbsp;
							结果--->&nbsp;&nbsp;"2012-07-03 15:00"
						</span>
					 </li>
					 <li class="ccay-form-row">
					 	<samp>getUTCTime</samp>
					 	<span class='ccay-form-input'>
							Date.getUTCTime(目标时区,当前时区);&nbsp;&nbsp;&nbsp;&nbsp;
							目标时区默认为系统当前设置时区，当前时区默认为+8(北京时区)，参数形式 +8 、 -8 ...
						</span>
					 </li>
				 </ul>
				 </div>
				
			 </li> 		
			</ul>
		</div>
		</form>
    </div>
    <div title='Demo' tabid='tab2'>
    	<h4><span onclick="Ccay.Common.toggle(this,'#demo1')" style="cursor:pointer;">实例1：数字格式化(Number)</span></h4>
    	<div style='padding-left:30px'>
	    	<div id="demo1" style="display:none">
				<span>1.1 转换成Date</span>
				<div class="secondLevel">
					<div class='demo'>
					    <span>Ccay.Format.toDate(1342862225000),该结果为：2012-07-21T17:17:05.000+0800</span>	<br>
					     <span>Ccay.Format.toDate(1342862225000).format(),该结果为："2012-07-21"</span>			    
					</div>
					<div class='demo'>
					    <span>试一试：</span>
					    <input type="text" class="i18n" i18nKey="1342862225000" id="n2Date"/>
					    <span class="ccay-button" onclick="alert(Ccay.Format.toDate($('#n2Date').val()*1))">
							<a class="ccay-icon confirm"></a>
							<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
						</span>
					</div>
					<div class="codeArea">
						<pre>Ccay.Format.toDate(value,format)</pre>
					</div>
				</div>
				<span>1.2 转换成DateTime的String格式</span>
				<div class="secondLevel">
					<div class='demo'>
					    <span>Ccay.Format.toDateTimeStr(1342862225000),该结果为："2012-07-21 17:17:05"</span>	
					</div>
					<div class='demo'>
					    <span>试一试：</span>
					    <input type="text" class="i18n" i18nKey="1342862225000" id="n2DateTime"/>
					    <span class="ccay-button" onclick="alert(Ccay.Format.toDateTimeStr($('#n2DateTime').val()*1))">
							<a class="ccay-icon confirm"></a>
							<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
						</span>
					</div>
					<div class="codeArea">
						<pre id=JS1_2'>Ccay.Format.toDateTimeStr(value,format,renderFormat)</pre>
					</div>
				</div>
				<span>1.3 转换成Int</span>
				<div class="secondLevel">
					<div class='demo'>
					    <span>Ccay.Format.toInt(123456.789),该结果为：123456</span>	
					</div>
					<div class='demo'>
					    <span>试一试：</span>
					    <input type="text" class="i18n" i18nKey="123456.789" id="n2Int"/>
					    <span class="ccay-button" onclick="alert(Ccay.Format.toInt($('#n2Int').val()*1))">
							<a class="ccay-icon confirm"></a>
							<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
						</span>
					</div>
					<div class="codeArea">
						<pre id=JS1_3'>Ccay.Format.toInt(value)</pre>
					</div>
				</div>
				<span>1.4 转换成Decimal</span>
				<div class="secondLevel">
					<div class='demo'>
					    <span>Ccay.Format.toDecimal(123456.789),该结果为：123456.79</span>	
					</div>
					<div class='demo'>
					    <span>试一试：</span>
					    <input type="text" class="i18n" i18nKey="123456.789" id="n2Decimal"/>
					    <span class="ccay-button" onclick="alert(Ccay.Format.toDecimal($('#n2Decimal').val()*1))">
							<a class="ccay-icon confirm"></a>
							<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
						</span>
					</div>
					<div class="codeArea">
						<pre id=JS1_4'>Ccay.Format.toDecimal(value)</pre>
					</div>
				</div>
				<span>1.5 转换成货币格式</span>
				<div class="secondLevel">
					<div class='demo'>
					    <span>Ccay.Format.toCurrency(123456.789),该结果为："123,456.79"</span>	
					</div>
					<div class='demo'>
					    <span>试一试：</span>
					    <input type="text" class="i18n" i18nKey="123456.789" id="n2Currency"/>
					    <span class="ccay-button" onclick="alert(Ccay.Format.toCurrency($('#n2Currency').val()*1))">
							<a class="ccay-icon confirm"></a>
							<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
						</span>
					</div>
					<div class="codeArea">
						<pre id=JS1_5'>Ccay.Format.toCurrency(value)</pre>
					</div>
				</div>
				<span>1.6 转换成文件大小</span>
				<div class="secondLevel">
					<div class='demo'>
					    <span>Ccay.Format.toFileSize(457892333),该结果为："436.68M"</span>	
					</div>
					<div class='demo'>
					    <span>试一试：</span>
					    <input type="text" class="i18n" i18nKey="457892333" id="n2FileSize"/>
					    <span class="ccay-button" onclick="alert(Ccay.Format.toFileSize($('#n2FileSize').val()*1))">
							<a class="ccay-icon confirm"></a>
							<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
						</span>
					</div>
					<div class="codeArea">
						<pre id=JS1_6'>Ccay.Format.toFileSize(value)</pre>
					</div>
				</div>	
	         </div>
	       </div>  
        <h4><span onclick="Ccay.Common.toggle(this,'#demo2')" style="cursor:pointer;">实例2：字符串格式化(String)</span></h4>
        <div style='padding-left:30px'>
        <div id="demo2" style="display:none">
        	<span>2.1 转换成Date的String格式</span>
        	<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toDateStr(1342862225000),该结果为："2012-07-21"</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="1342862225000" id="s2Date1"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateStr($('#s2Date1').val()))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class='demo'>
				    <span>Ccay.Format.toDateStr(1342862225000,'MM/dd/yyyy'),该结果为："07/21/2012"</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey='1342862225000' id="s2Date2"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateStr($('#s2Date2').val()*1,'MM/dd/yyyy'))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toDateStr(value,format);</pre>
				</div>
			</div>
			<span>2.2 设置渲染格式</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toDateStr('12/12/2012','MM/dd/yyyy','yyyy-MM-dd') ,该结果为："2012-12-12"</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="12/12/2012" id="s2DateF"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateStr($('#s2DateF').val(),'MM/dd/yyyy','yyyy-MM-dd'))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toDateStr(value,format,renderFormat)</pre>
				</div>
			</div>
			<span>2.3 转换成Number</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toNumber('222,333,111.12') ,该结果为：222333111.12</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="222,333,111.12" id="s2Num"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toNumber($('#s2Num').val()))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toNumber({String})</pre>
				</div>
			</div>
			<span>2.4 设置超出区域的效果</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toEllipsis('12345678901234567890',10)<br>
				    该结果为："&lt;label class='ccay-Text-Ellipsis' title="12345678901234567890"&gt;1234567890...&lt;/label&gt;"	</span>    
				</div>
				
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="1234567890123456789012345678901234567890" id="s2E"/>
				    <span class="ccay-button" onclick="Ccay.example.baseFunction.dataFormat.test()">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div id='tmpl' class="ccay-form-body">
		        <ul>
					<li class="ccay-form-row">
					 	<samp>效果</samp>
					 	<span class='ccay-form-input' id='result'>
						</span>
					 </li>
				</ul>
				</div>	 
				<div class="codeArea">
					<pre>Ccay.Format.toEllipsis(value,len)</pre>
				</div>
			</div>				
        </div>
        </div>
        <h4><span onclick="Ccay.Common.toggle(this,'#demo3')" style="cursor:pointer;">实例3：布尔值格式化(Boolean)</span></h4>
        <div style='padding-left:30px'>
        <div id="demo3" style="display:none">       			
			<span>3.1 转换成“是”或“否”</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toBoolView(true)&nbsp;&nbsp;Ccay.Format.toBoolView(false),该结果分别为："是"和"否"</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="1" id="b2S1"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toBoolView($('#b2S1').val()*1))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class='demo'>	
				    <span>试一试：</span>		    
				    <input type="text" class="i18n" i18nKey="0" id="b2S2"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toBoolView($('#b2S2').val()*1))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toBoolView({boolean})</pre>
				</div>
            </div>
            <span>3.2 转换成Html标签</span>
            <div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toBoolView(true,1)&nbsp;&nbsp;Ccay.Format.toBoolView(false,1) ,该结果分别为：<a class='ccay-icon yes nocursor' title='是'></a>和<a class='ccay-icon no nocursor' title='否'></a></span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="1" id="b2b1"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toBoolView($('#b2b1').val()*1,1))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="0" id="b2b2"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toBoolView($('#b2b2').val()*1,1))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toBoolView({boolean},1)</pre>
				</div>
             </div>
        </div> 
        </div>       
        <h4><span onclick="Ccay.Common.toggle(this,'#demo4')" style="cursor:pointer;">实例4：日期格式化(Date)</span></h4>
        <div style='padding-left:30px'>
        <div id="demo4" style="display:none">
            <span>4.1 把Date转换成String</span>
            <div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toDateTimeStr(new Date("2014-09-03 14:14:05")) ,该结果为："2014-09-03 14:14:05"</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" id='d2s1' class="init ccay-calendar" format="datetime"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateStr(Ccay.Format.toDate($('#d2s1').ccayGetValue())))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toDateStr({date})</pre>
				</div>
			</div>
			<span>4.2 转换成DateTime的String格式</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toDateTimeStr(new Date()); 该结果为：日期字符串</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" id='d2s2' class="init ccay-calendar" format="datetime"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateTimeStr(Ccay.Format.toDate($('#d2s2').ccayGetValue())))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toDateTimeStr({date})</pre>
				</div>
			</div>
			<span>4.3 把Date转换成Number</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toDateNum(new Date("2014-09-03")),&nbsp;该结果为：日期数字&nbsp;1409702400000</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" id='d2N' class="init ccay-calendar" format="datetime"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateNum(Ccay.Format.toDate($('#d2N').ccayGetValue())))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toDateNum({date})</pre>
				</div>
			</div>
			<span>4.4  把Date转换成String</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toDateBefore(date)，该结果为：日期字符串，如："刚刚";</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" id='d2S3' class="init ccay-calendar" format="datetime"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateBefore(Ccay.Format.toDate($('#d2S3').ccayGetValue())))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toDateBefore({date})</pre>
				</div>
			<div class="secondLevel">
        </div>
        </div>
    </div>
  </div>
 </div>
</div>